<template>
	<view class="item flex" @click="linkDetail(item)">
		<view class="left flex justify-center align-center flex-shrink">
			<image :src="item.activityImage" mode=""></image>
		</view>
		<view class="right flex justify-between flex-column">
			<view class="top">
				<view class="title">
					{{item.activityName}}
				</view>
				<view class="city">
					{{item.activityAddress}}
				</view>
			</view>
			<view class="detail" v-if="identety == 1" @click.stop="detail(item.activityId)">
				报名详情
			</view>
			<view v-if="item.activityPrice != 0" class="money flex">
				<view class="text flex align-end">
					报名费：
				</view>
				<view class="num flex align-end">
					<view class="icon">
						¥
					</view>
					<view class="word">
						{{item.activityPrice}}
					</view>
				</view>
			</view>
		</view>
		<view v-if="item.activityPrice == 0" class="free">
			<image src="https://sanfuzhide.oss-cn-hangzhou.aliyuncs.com/square/FREE.png" mode=""></image>
		</view>
		<view v-if="item.activityType" class="end">
			<image src="https://sanfuzhide.oss-cn-hangzhou.aliyuncs.com/square/Hasended.png" mode=""></image>
		</view>
		<!-- <view class="isclass flex justify-center align-center">
			<image v-if="item.isgroup" src="https://sanfuzhide.oss-cn-hangzhou.aliyuncs.com/my/gongsi123.png" mode=""></image>
			<image v-if="!item.isgroup" src="https://sanfuzhide.oss-cn-hangzhou.aliyuncs.com/my/user123.png" mode=""></image>
		</view> -->
	</view>
</template>

<script>
	export default {
		name: "activityManagement",
		props: {
			item: Object,
			identety:Number
		},
		data() {
			return {

			};
		},
		methods:{
			//跳转详情页
			linkDetail(item) {
				uni.setStorageSync('pageNum',item.activityId)
				if(item.activityType == 1){
					
				}else{
					uni.navigateTo({
						url: '/pagesB/activityDetail/activityDetail'
					})
				}
			},
			detail(e){
				uni.navigateTo({
					url: '/pagesB/takeIn/takeIn?id=' + e
				})
				console.log(1)
			}
		}
	}
</script>

<style lang="scss">
	.item {
		margin-top: 40rpx;
		width: 690rpx;
		height: 185rpx;
		background: #FFFFFF;
		box-shadow: 0rpx 1rpx 18rpx 0rpx rgba(131, 131, 131, 0.07);
		border-radius: 24rpx;
		padding: 30rpx;
		position: relative;

		.left {
			width: 166rpx;
			height: 125rpx;
			border-radius: 8rpx;
			overflow: hidden;
			margin-right: 20rpx;
		}

		.right {
			.detail{
				position: absolute;
				top: 20rpx;
				right: 0;
				color: #999999;
			}
			.top {
				.title {
					font-weight: bold;
					color: #333333;
					font-size: 32rpx;
					line-height: 1;
					max-width: 330rpx;
				}

				.city {
					margin-top: 14rpx;
					font-weight: 500;
					color: #999999;
					font-size: 24rpx;
					line-height: 1;
				}
			}

			.money {
				.text {
					font-weight: 500;
					color: #999999;
					font-size: 24rpx;
					line-height: 1;
				}

				.num {
					font-weight: 500;
					color: #E05F57;
					line-height: 1;

					.icon {
						font-size: 22rpx;
						line-height: 1;
					}

					.word {
						font-size: 40rpx;
						line-height: 1;
					}
				}
			}
		}

		.isclass {
			position: absolute;
			right: 30rpx;
			top: -17rpx;
			width: 74rpx;
			height: 82rpx;
		}

		.free {
			position: absolute;
			left: 0rpx;
			top: 0rpx;
			width: 92rpx;
			height: 92rpx;
		}

		.end {
			width: 100rpx;
			height: 84rpx;
			position: absolute;
			bottom: -10rpx;
			right: 30rpx;
		}
	}
</style>
